/*
 * @Description: 移交列表弹窗
 * @Author: Rfan
 * @Date: 2022-05-12 16:28:15
 * @LastEditTime: 2022-05-18 09:20:47
 */

import { useEffect, useMemo, useState } from 'react';
import { Alert, Button, Modal, Space, Table } from 'antd';
import type { FC } from 'react';
import { ICommonDialog } from '@/interfaces/global';
import { useFormatMessage } from '@/utils/intlHelpers';
import ExpGeneratorDialog, { TScopeType } from '@/components/ExpGeneratorDialog';
import { jsonClone } from '@/utils';

const { Column } = Table;
interface TransferListProps extends ICommonDialog {}

const TransferList: FC<TransferListProps> = (props) => {
  console.log('UploadFloder', props.visible);
  const { visible, onClose } = props;
  const formatMessage = useFormatMessage();
  const [loading, setLoading] = useState(false);
  const [total, setTotal] = useState(0);
  const [listQuery, setListQuery] = useState({
    pageNo: 1,
    pageSize: 10,
    params: {}
  });
  // 添加规则弹窗状态
  const [addRuleVisible, setAddRuleVisible] = useState(false);
  // 传入ExpGeneratorDialog的范围参数
  const [scope, setScope] = useState<TScopeType>({
    atCode: 0,
    atType: 0,
    fondsId: 0,
    archiveTypeId: 0,
    level: []
  });

  useEffect(() => {
    if (visible) {
      setLoading(false);
      setTotal(0);
    }
  }, [visible]);

  /**
   * @description: 关闭弹窗
   */
  const onCancel = () => {
    onClose();
  };
  /**
   * @description 切换页码触发
   * @param {number} page 页码
   * @param {number} pageSize 每页条目数
   */
  const pageChange = (page: number, pageSize: number) => {
    setListQuery((state) => ({
      ...state,
      pageNo: page,
      pageSize
    }));
  };

  /**
   * @description: 关闭添加规则弹窗，根据参数判断取消还是保存
   * @param {string} condition 添加的规则，保存时使用
   * @param {TScopeType} scope 传入的环境，用于同意参数，保存时使用
   */
  const closeExpDialog = (condition?: string, scope?: TScopeType) => {
    if (condition) {
      console.log({ condition }, setScope);
      const params = jsonClone(scope);
      params.level = scope.level[0];
      params.ruleDescription = condition;

      // addRightSpecFunc(params)
      //   .then(() => {
      //     setAddRuleVisible(false);
      //   });
    } else {
      setAddRuleVisible(false);
    }
  };

  return (
    <Modal
      title="目录导入EXCEL"
      visible={visible}
      width={600}
      maskClosable={false}
      destroyOnClose
      onCancel={onCancel}
      footer={[
        <Button key="close" onClick={onCancel}>
          取消
        </Button>,
        <Button key="createAdd" type="primary">
          创建并添加档案
        </Button>,
        <Button key="create" type="primary">
          创建
        </Button>
      ]}
    >
      <Alert
        description="注意：你可在【档案管理】界面上选择档案添加至此，也可通过条件设置系统自动添加档案"
        type="warning"
        showIcon
      />
      <div className="table-title">
        <h6>移交档案列表</h6>
        <Space>
          <Button>清空</Button>
          <Button>通过条件添加档案</Button>
        </Space>
      </div>
      <Table
        dataSource={[]}
        loading={loading}
        rowKey="id"
        bordered
        pagination={{
          current: listQuery.pageNo,
          pageSize: listQuery.pageSize,
          total,
          onChange: pageChange
        }}
      >
        <Column title="序号" dataIndex="id" key="id" align="center" />
        <Column title="档号" dataIndex="code" key="code" align="center" />
        <Column title="题名" dataIndex="name" key="name" align="center" />
        <Column title="档案类型" dataIndex="name" key="name" align="center" />
        <Column title="密级" dataIndex="name" key="name" align="center" />
        <Column
          title={formatMessage('tableAction')}
          key="action"
          align="center"
          width={200}
          render={(_text) => (
            <Space direction="vertical">
              <Button type="link" size="small" danger>
                删除
              </Button>
            </Space>
          )}
        />
      </Table>
      {useMemo(
        () => (
          <ExpGeneratorDialog visible={addRuleVisible} scope={scope} onClose={closeExpDialog} />
        ),
        [addRuleVisible]
      )}
    </Modal>
  );
};

export default TransferList;
